<template>
	<view class="main">
		<view class="city">
			<view class="city-box" >
				<text class="city-lable">所在城市：</text>
				<text class="city-name">{{ city.name }}</text>
			</view>
			<view class="">
				<text>{{ address }}</text>
			</view>
			<button size="mini" type="primary" @click="open">选择城市</button>
		</view>
		<view class="">
			<uni-search-bar :focus="true" @input="input" placeholder="输入地址"></uni-search-bar>
		</view>
		<view class="result-box">
			<view class="result-list-item" v-for="(item,index) in result" :key="index" @click="sureLocation(item)">
		
					<text>{{item.formatted_address}}</text>
					
			</view>
		</view>
		<unicloud-city-select ref="citySelect" :hot-city="hotCity" :location="true" @select="select"></unicloud-city-select>
	</view>
</template>

<script>
	const aMap=uniCloud.importObject('uni-map-co',{customUI:true})
	import setToTarget from '../../utils/setTarget';
export default {
	data() {
		return {
			address: '',
			city: {
				code: '',
				name: '定位中...'
			},
			result:[],
			// 热门城市
			hotCity: [
				{ code: '110100', name: '北京' },
				{ code: '310100', name: '上海' },
				{ code: '330100', name: '杭州' },
				{ code: '440100', name: '广州' },
				{ code: '440300', name: '深圳' },
				{ code: '320100', name: '南京' },
				{ code: '500100', name: '重庆' },
				{ code: '510100', name: '成都' }
			]
		};
	},
	methods: {
		// 点击城市选项
		select(city) {
			this.city = city;
			console.log("城市",city);
		},
		// 打开城市选择页面
		open() {
			this.$refs.citySelect.open();
		},
	async input(e){
		console.log(e);
		try{
			let data={
				address:e,
				city:this.city.name
			}
			console.log(data);
			const res=await aMap.address2location(data)
			if(res.errCode===0&&res.originalResult?.status==='1'){
				this.result=res.originalResult.geocodes
			}
			
			console.log("取得的位置",res);
		}catch(e){
			console.error(e);
		}
		},
	sureLocation(item){
		const location={
			longitude:parseFloat(item.location.split(',')[0]),
			latitude:parseFloat(item.location.split(',')[1])
		}
		this.$store.commit('msg/SET_queryParam', {
			type: 'public',
			location: location
		});
		this.$store.commit('msg/SET_isFly', true);
		this.$store.commit('msg/SET_location', location);
		setToTarget('public', { targetName: item.formatted_address });
     	uni.navigateBack()
	}		
		
	}
};
</script>

<style lang="scss" scoped>
	.main{
		background-color: #efefef;
		padding: 20rpx;
	}
	.city{
		display: flex;
		align-items: center;
		gap: 20rpx;
		.city-lable{
			color: #55aaff;
		}
		.city-name{
			font-weight: 600;
			color: #b1b1b1;
		}
	}
	.result-box{
		border-radius: 10rpx;
	  padding: 10rpx 20rpx;
	 gap: 10rpx; 
	}
	.result-list-item{
		display: flex;
		align-items: center;
	 	border-radius: 10rpx;
		padding: 20rpx;
		background-color: #fff;
		margin-bottom: 2rpx;
		:active{
			background-color: #efefef;
		}
	}
</style>
